<template>
  <router-layout class="lackyDraw">
    <div class="list">
      <Nodata v-if="isNoData"></Nodata>
      <van-cell v-else v-for="(item,index) in dataList" :key="index">
        <div class="lacky-list" @click="openLink(item)">
          <van-row type="flex">
            <van-col>
              <div class="list-img">
                <img :src="item.file_path" width="100%" alt>
                <div class="btns" v-if="item.active_status==1" style="background-color: #01A0EF">
                  <p>预热</p>
                </div>
                <div class="btns" v-if="item.active_status==2" style="background-color: #E6A23D">
                  <p>报名中</p>
                </div>
                <div class="btns" v-if="item.active_status==3" style="background-color: #E6A23D">
                  <p>待进行</p>
                </div>
                <div class="btns" v-if="item.active_status==4" style="background-color: #67C23A">
                  <p>进行中</p>
                </div>
                <div class="btns" v-if="item.active_status==5" style="background-color: #DADADA">
                  <p>已结束</p>
                </div>
              </div>
            </van-col>
            <van-col>
              <div class="list-right">
                <div class="right-header fn-clear">{{item.active_title}}</div>
                <div class="base">
                  <p
                    class="base-text"
                  >活动时间：{{item.active_start_time | formate_date}}-{{item.active_end_time | formate_date}}</p>
                </div>
              </div>
            </van-col>
          </van-row>
        </div>
      </van-cell>
    </div>
  </router-layout>
</template>
<script>
import { activity_listAllMy } from "@/api/activity";
import Nodata from "../public/nodata/Nodata"; // 导入暂无数据组件
import moment from "moment";

export default {
  name: "MyJoin",
  components: { Nodata },
  data() {
    return {
      isNoData: false,
      dataList: [],
      listQuery: {
        company_id: localStorage.getItem("companyId") - 0
      }
    };
  },
  filters: {
    formate_date(v) {
      return moment(v).format("YYYY/MM/DD");
    }
  },
  methods: {
    //跳转到详情页
    openLink(item) {
      this.$router.push({
        name: "ActivityDetail",
        query: { id: item.id, status: item.active_status, name: "order" }
      });
    },
    async initList() {
      let query = Object.assign({}, this.listQuery);
      let res = await activity_listAllMy(query);
      if (res.data.status == 100) {
        this.dataList = res.data.data.rows;
        if (!this.dataList.length) {
          this.isNoData = true;
        }
      }
    }
  },
  created() {
    this.initList();
  }
};
</script>
<style lang="scss" scoped>
@import "MyJoin";
</style>
